<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>菜单</title>
</head>
<body>
<style type="text/css">
    .Level1{
        line-height: 25px;
        border-color: #ebebeb;
        border: 1px solid #ebebeb;
        margin-bottom: 20px;
    }
    .level1title{
        background-color: #CCEEFF;
    }
    .level2title{
        background-color: #DDDDDD;
    }
    .divOver{
        background-color: #CCFF99;
    }
    span{
        margin-right: 10px;
    }
    .menu_hide{
        background-color: #DDAA00;
    }
    .menu_dev{
        background-color: #FF8888;
    }
    .menu_delete{
        background-color: #FF3333;
    }
</style>
<h3>菜单</h3>
<div class="container" style="margin-bottom: 20px;">

    <span class="menu_hide" style="padding: 5px;"> 隐藏菜单 </span>
    <span class="menu_dev" style="padding: 5px;"> 开发者菜单 </span>
    <!-- <span class="menu_delete" style="padding: 5px;"> 删除的菜单 </span> -->
    <!-- <a class="btn btn-info btn-sm pull-right" href="{:url('tree_show', ['module'=>input('module')])}">查看全部菜单</a> -->
</div>
<div class="container">
    <div class="Level1">
        <div class="level1title onerow">
            <!-- level1-title -->
            <span id="1" class="menu_dev">
            aaa
            </span>
            <span id="2" class="menu_dev">
            aaa
            </span>
            <span id="3">
            aaa
            </span>
            <!-- /level1-title -->
            <span class="pull-right">
            <a href="#">编辑</a>
            <a class="ajaxGet confirm" href="#">删除</a>
            </span>
        </div>
        <!-- level2 -->
        <div class="level2">
            <div class="level2title onerow">
                <!-- level2-title -->
                <span id="v2-1"
                      class="menu_hide"
                >
                &nbsp;&nbsp;v2
                </span>
                <span id="v2-2"
                      class="menu_dev"
                >
                &nbsp;&nbsp;v2
                </span>
                <span id="v2-3"
                >
                &nbsp;&nbsp;v2
                </span>
                <!-- /level2-title -->
                <span class="pull-right">
                <a href="#">编辑</a>
                <a class="ajaxGet confirm" href="#">删除</a>
                </span>
            </div>
            <!-- level3 -->
            <div class="level3">
                <div class="onerow">
                    <!-- level3-title -->
                    <span id="v3-1"
                        class="menu_dev"
                    >
                    v3
                    </span>
                    <span id="v3-2"
                          class="menu_hide"
                    >
                    v3
                    </span>
                    <span id="v3-3"
                    >
                    v3
                    </span>
                    <!-- /level3-title -->
                    <span class="pull-right">
                     <a href="#">编辑</a>
                        <a class="ajaxGet confirm" href="#">删除</a>
                    </span>
                </div>
            </div>
            <!-- /level3 -->
        </div>
        <!-- /level2 -->
    </div>
</div>


<!-- jQuery -->
<script src="../AdminLTE-3.0.5/plugins/jquery/jquery.min.js"></script>


<script language="javascript">
    $(function(){
        //当鼠标滑入时将div的class换成divOver
        $('.onerow').hover(function(){
                $(this).addClass('divOver');
            },function(){
                //鼠标离开时移除divOver样式
                $(this).removeClass('divOver');
            }
        );
    });
</script>
</body>
</html>